<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/register.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.css">
    <title>logon登录</title>
</head>
<body>
    <!-- 顶部提醒 -->
    <div class="caution">
        
    </div>
   
 
    <!-- logo行 -->
    <div class="searchBar">
        <div class="searchBarFixed">
            <div class="w1200 searchBarFixedBox">
                <!-- logo -->
                <div class="logo">
                    <a href="./index.html">
                        <img src="img/logo.png" alt="">
                    </a>
                </div>
                <div class="searchBarFixedBox-right">
                    <span class="searchBarFixedBox-right-s1">正版好书</span><span class="searchBarFixedBox-right-s2">全场满69包邮</span><span class="searchBarFixedBox-right-s3">特价书一折起</span>
                </div>
               
            </div>
        </div>
    </div>
    <div class="fenggehang"></div>


    <div class="register-d">
        <div class="register-box">
            <div class="register-boxx">
                <div class="register-boxx-lt">用户登录</div>

                <!-- -------输入框----------- -->
                <div 
                class="register-boxx-bottom">
                    <div class="register-boxx-bottom-d"><span class="register-boxx-bottom-d-s1">用户名:</span><span class="register-boxx-bottom-d-s2"><input type="text" class="register-boxx-bottom-d-s2-ipt1"></span></div>
                    <div class="register-boxx-bottom-d"><span class="register-boxx-bottom-d-s1">密码:</span><span class="register-boxx-bottom-d-s2"><input type="text" class="register-boxx-bottom-d-s2-ipt2"></span></div>
                    <div class="register-boxx-bottom-d"><span class="register-boxx-bottom-d-s1">验证码:</span><span class="register-boxx-bottom-d-s2 rbbds2-2"></span><span class="register-boxx-bottom-d-s3"></span><p>换一换</p></div>
                </div>

                <!-- -----按钮------ -->
                <div class="loginBut">
                    <span class="loginBut-s">登录</span>
                </div>

                <script>
                    const ipt1 = document.querySelector(".register-boxx-bottom-d-s2-ipt1");
                    const ipt2 = document.querySelector(".register-boxx-bottom-d-s2-ipt2");
                    const loginBut = document.querySelector(".loginBut-s");

                    const url = "http://localhost:3000/data/login.json";
                    loginBut.onclick = function(){
                        name = ipt1.value;
                        password = ipt2.value;

                        ajax({
                            url:url,
                            data:{
                                type:"register",
                                name:name,
                                password:password,
                            },
                        })
                    }

                </script>

                <!-- ------忘记密码、登录------ -->
                <div class="otherLink">
                    <div class="otherLink-d">
                        <span class="otherLink-d-s">忘记密码？</span><a href="./register.html" class="otherLink-d-a">新用户注册&gt;&gt;</a>
                    </div>
                </div>
                <!-- ----分隔线------ -->
                <div class="fgx">
                    <div class="fgx-d">
                        <span class="xian"></span><span class="fgx-d-s2">使用以下账号登录</span><span class="xian"></span>
                    </div>
                </div>
                <!-- ---------其他登录方式---------- -->
                <div class="otherLogin">
                    <div  class="otherLogin-box">
                        <a href="#">
                            <span class="iconfont otherLogin-box-s1" >&#xe61d;
                            </span>
                            微博
                        </a>
                        <a href="#">
                            <span class="iconfont otherLogin-box-s2">&#xe600;
                            </span>
                            QQ
                        </a>
                        <a href="#">
                            <span class="iconfont otherLogin-box-s3">&#xe637;
                            </span>
                            微信
                        </a>
                        <a href="#" style="border: none;">
                            <span class="iconfont otherLogin-box-s4">&#xe621;
                            </span>
                            百度
                        </a>

                    </div>
                </div>
                <div class="explainLink">
                    <div class="explainLink-box">
                        <a href="#">QQ、微博、百度登录绑定微信账号的解决方案</a>
                    </div>
                </div>

            </div>

        </div>
    </div>



  
    <!-- --------底部-------- -->
    <div class="bottom-box">
    </div>
   

</body>

</html> 

<script src="./libs/jquery.js"></script>
<script>
    // 顶部提醒
    $(".caution").load("http://localhost:3000/public/public_index.html .cautionioc")


    //底部
    $(".bottom-box").load("http://localhost:3000/public/public_index.html .bottom")
</script>
<script src="./libs/require.js" data-main="./js/logon.js"></script>

